// 定义一个存储副作用函数的桶
const bucket = new Set();

// 原始数据
const data = {
  text: "hello world",
  name: "爱心"
};
// 对原始数据进行代理
const proxyData = new Proxy(data, {
  // 拦截读取操作
  get(target, key) {
    if (activeEffect) {
      bucket.add(activeEffect);
    }
    return target[key];
  },
  // 拦截设置操作
  set(target, key, value) {
    target[key] = value;
    // 将副作用函数从桶bucket中取出并执行
    bucket.forEach((fn) => fn());
    return true;
  },
});

// 用一个全局变量存储被注册的副作用函数
let activeEffect;
// effect函数用于注册副作用函数
function effect(fn) {
  // 调用effect注册副作用函数时，将副作用函数fn赋值给activeEffect
  activeEffect = fn;
  // 执行副作用函数
  fn();
}

effect(() => {
  console.log("effect run about text:"); // 会打印2次？
  document.body.innerText = proxyData.text;
});

effect(() => {
  console.log('effect run about title:',)
  document.title = proxyData.name
})

setTimeout(() => {
  proxyData.text = 'hello vue3'
}, 1000);
